<template>
	<view class="pages">
		<h-nav-bar :fixed="true" backgroundColor="#fff">
			<view class="topCen" @click="openRl">
				{{ dateTime == newTime ? '今天' : dateTime == preTime ? '昨天' : dateTime == nextTime ? '明天' : dateTime }}

				<image v-show="timeShow" src="@/static/yunchan/weight/shanga.png" class="topCen_img"></image>
				<image v-show="!timeShow" src="@/static/yunchan/weight/xiaa.png" class="topCen_img"></image>
			</view>
			<!-- <template #right>
				<view class="head_img" v-show="!isShow && (itemNum > 0 || sportList?.length > 0)">
					<image mode="scaleToFill" src="@/static/yunchan/weight/fx.png" @click="toDetail"></image>
				</view>
				<view class="head_img1" v-show="!isShow">
					<image mode="scaleToFill" src="@/static/yunchan/weight/sz.png" @click="toUrl('/pediatrics/weightManagement/dietaryRecords/reminderSetting')"></image>
				</view>
			</template> -->
		</h-nav-bar>
		<view class="sec_head" @touchstart="touchStart" @touchend="touchEndWeek" @touchmove="handleMove" :style="{ top: statusHeight + 80 + 'rpx' }">
			<view class="sec_head_box" :style="{ transform: 'translate(' + calenderMove.x + 'px' }">
				<view class="sec_head_l" v-for="(item, index) in weekList" :key="index" style="color: #333">{{ item.title }}</view>
				<view class="sec_head_l" v-for="(item, index) in weekList" :key="index" :style="[
            { color: dateTime == item.value ? '#fff' : '#333' },
            { background: dateTime == item.value ? '#54CEAB' : '' },
          ]" @click="checkWeek(item, index)">{{ item.title }}</view>
				<view class="sec_head_l" v-for="(item, index) in weekList" :key="index" style="color: #333">{{ item.title }}</view>
			</view>
		</view>
		<view class="section">
			<view class="sec_none" v-show="itemNum == 0 && sportList?.length == 0 && !loading">
        <image class="sec_none_con_img" src="@/static/images/nones.png"></image>
          <view class="sec_none_text">暂无数据记录</view>
			</view>
			<view class="sex_meal" v-show="isShow == 'food' || !isShow">
				<view class="sex_meal_list" v-for="(item, index) in itemList" :key="index" v-show="item.list.length > 0">
					<view class="sex_meal_list_title">{{ item?.mealName }}</view>
					<view class="sex_meal_list_box">
						<view class="sex_meal_list_box_list" v-for="(items, indexs) in item?.list" :key="indexs" :id="index + ',' + indexs" @touchstart="touchStart" @touchend="touchEndTab" @click="toEdit(index, indexs, items, item?.mealName)">
							<image :src="items?.icon" class="sex_meal_list_box_list_img"></image>
							<view class="sex_meal_list_box_list_box">
								<view class="sex_meal_list_box_list_box_l">
									<view class="sex_meal_list_box_list_box_l_t">{{ items?.name }}</view>
									<view class="sex_meal_list_box_list_box_l_b">{{ items?.num }}{{ items?.unit }}</view>
								</view>
								<view class="sex_meal_list_box_list_box_r" v-show="!isShow">
									<image src="@/static/shop/right.png"></image>
								</view>
								<view class="sex_meal_list_box_list_box_del" v-show="items?.del && !isShow" @click.stop="toDel(index, indexs, items?.id)">删除</view>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view class="sex_meal" v-show="isShow == 'sport' || !isShow">
				<view class="sex_meal_list" v-show="sportList?.length > 0">
					<view class="sex_meal_list_title">运动</view>
					<view class="sex_meal_list_box">
						<view class="sex_meal_list_box_list" v-for="(items, indexs) in sportList" :key="indexs" :id="indexs" @touchstart="touchStart" @touchend="touchEndSportTab" @click="toEditSport(indexs, items)">
							<image :src="items?.icon" class="sex_meal_list_box_list_img"></image>
							<view class="sex_meal_list_box_list_box">
								<view class="sex_meal_list_box_list_box_l">
									<view class="sex_meal_list_box_list_box_l_t">{{ items?.name }}</view>
									<view class="sex_meal_list_box_list_box_l_b">{{ items?.num }}{{ items?.unit }}</view>
								</view>
								<view class="sex_meal_list_box_list_box_r" v-show="!isShow">
									<image src="@/static/shop/right.png"></image>
								</view>
								<view class="sex_meal_list_box_list_box_del" v-show="items?.del && !isShow" @click.stop="toSportDel(indexs, items?.id)">删除</view>
							</view>
						</view>
					</view>
				</view>
			</view>
			<h-line height="180"></h-line>
		</view>
		<!-- <view class="foot" v-show="!isShow">
			<view class="foot_l" v-for="(item, index) in footList" :key="index" @click="bindFoot(index)">
				<image class="foot_l_img" :src="item?.icons" v-if="footIndex==index"></image>
				<image class="foot_l_img" :src="item?.icon"></image>
				<view class="foot_l_text">{{ item?.title }}</view>
			</view>
		</view> -->

		<view class="date_box" v-if="timeShow" :style="{ top: statusHeight + 80 + 'rpx' }" @click="timeShow = false">
			<view class="date_box_con" @click.stop="">
				<h-uni-calendar-new :date="dateTime" :selected="info?.selected" :show-month="false" :startDate="startDate" :endDate="endDate" headBg="#fff" @change="changeDay" @backToday="backToday" />
			</view>
		</view>
		<!-- 分享 -->
		<!--<h-share ref="shareRef" :showLh="false"></h-share>-->
		<h-share ref="shareRef" :showLh="false" :isDoctor="true" @gotoChat="gotoChatShare"></h-share>
		<h-login ref="login"></h-login>

		<u-popup :show="editShow" mode="bottom" @close="editShow = false" closeable :round="10">
			<view class="add_box">
				<view class="topCena">
					<view class="head_data" style="font-size: 28rpx">
						<view class="uni-input">
							{{ formatDate(new Date(dateTime), 'MM月DD日') }} {{ editTitle }}
						</view>
					</view>
				</view>
				<h-num-keyboard type="meal" :title="editDetail?.name" :imgUrl="editDetail?.icon" :num="mealNum" :unit="editDetail?.unit" @bind="bindNum" textColor="#54CEAB"></h-num-keyboard>
			</view>
		</u-popup>
		<u-popup :show="editSportShow" mode="bottom" @close="editSportShow = false" closeable :round="10">
			<view class="add_box">
				<view class="topCena">
					<view class="head_data" style="font-size: 28rpx">
						<view class="uni-input">
							{{ formatDate(new Date(dateTime), 'MM月DD日') }}
						</view>
					</view>
				</view>
				<h-num-keyboard type="sport" :title="editSportDetail?.name" :imgUrl="editSportDetail?.icon" :num="mealSportNum" :unit="editSportDetail?.unit" @bind="bindSportNum" textColor="#54CEAB"></h-num-keyboard>
			</view>
		</u-popup>

		<!-- 加餐弹框 -->
		<u-popup :show="showExtraMeal" :round="10" mode="bottom" @close="showExtraMeal = false">
			<view class="ExtraMeal_box">
				<view class="ExtraMeal_list" v-for="(item, index) in extraMealList" :key="index" @click="addExtraMeal(index)">{{ item }}</view>
				<view class="cancel" @click="showExtraMeal = false">取消</view>
			</view>
		</u-popup>
	</view>
</template>

<script setup lang="ts">
	import { ref, reactive, nextTick } from 'vue'
	import { formatDate } from '@/utils/utils'
	import { navigateTo, showToast, navigateBack, redirectTo } from '@/utils'
	import dayjs from 'dayjs'
	import {
		onLoad,
		onPullDownRefresh,
		onReachBottom,
		onReady,
		onShow,
		onPageScroll,
		onUnload,
		onHide,
		onBackPress,
	} from '@dcloudio/uni-app'
	import {
		ycDietDailyDiet,
		ycDietRecordStartDate,
		ycDietDelRecord,
		ycDietDateList,
		ycSportDateList,
		ycDietEditDiet,
		ycDietDailySport,
		ycSportEditDiet,
		ycSportDelRecord,
	} from '@/api/weight/index.js'
	import { useMemberStore } from '@/stores'
	const login = ref(null) // 登录组件实例
	const store = useMemberStore()
	var token = store?.token
	const statusHeight = ref(0)
	const loading = ref(false)
	const timeShow = ref(false)
	const calenderMove = ref({
		x: 0,
		y: 0,
	})
	const weekList = ref([{
			title: '日',
			value: '',
		},
		{
			title: '一',
			value: '',
		},
		{
			title: '二',
			value: '',
		},
		{
			title: '三',
			value: '',
		},
		{
			title: '四',
			value: '',
		},
		{
			title: '五',
			value: '',
		},
		{
			title: '六',
			value: '',
		},
	])
	const dateTime = ref(formatDate(new Date(), 'YYYY-MM-DD'))
	const weekTime = ref(formatDate(new Date(), 'YYYY-MM-DD'))
	const newTime = ref(formatDate(new Date(), 'YYYY-MM-DD'))
	const preTime = ref('')
	const nextTime = ref('')

	function getUp() {
		var tt = new Date()
		var ti = tt.getTime() + 1000 * 60 * 60 * 24 * 1
		nextTime.value = formatDate(ti, 'YYYY-MM-DD')
		var tc = tt.getTime() - 1000 * 60 * 60 * 24 * 1
		preTime.value = formatDate(tc, 'YYYY-MM-DD')
	}
	const dayList = ref([1, 2, 3, 4, 5, 6, 7])
	const shareRef = ref(null)
	const info = ref({
		lunar: true,
		range: true,
		insert: false,
		selected: [],
	})
	const footList = ref([{
			title: '早餐',
			icon: '/static/yunchan/weight/foot/a.png',
			icons: '/static/yunchan/weight/foot/aa.png',
		},
		{
			title: '午餐',
			icon: '/static/yunchan/weight/foot/b.png',
			icons: '/static/yunchan/weight/foot/ba.png',
		},
		{
			title: '晚餐',
			icon: '/static/yunchan/weight/foot/c.png',
			icons: '/static/yunchan/weight/foot/ca.png',
		},
		{
			title: '加餐',
			icon: '/static/yunchan/weight/foot/d.png',
			icons: '/static/yunchan/weight/foot/da.png',
		},
		{
			title: '运动',
			icon: '/static/yunchan/weight/foot/e.png',
			icons: '/static/yunchan/weight/foot/ea.png',
		},
	])
	const itemList = ref([])
	const sportList = ref([])
	const footIndex = ref(10)
	const startDate = ref('')
	const endDate = ref('')
	const editShow = ref(false)
	const editDetail = ref({})
	const editTitle = ref('')
	const editIndex = ref(0)
	const editIndexs = ref(0)
	const mealNum = ref(0)
	const isShow = ref('')
	const editSportShow = ref(false)
	const editSportIndex = ref(0)
	const editSportDetail = ref({})
	const mealSportNum = ref(0)
	const showExtraMeal = ref(false)
	const itemNum = ref(0)
	const extraMealList = ref(['早加餐', '午加餐', '晚加餐'])
	let childId=""
  const userId = ref(0)
	onLoad((o) => {
		console.log(o)
		childId=o.childId
    userId.value = o?.userId
		if(o?.time) {
			dateTime.value = o?.time || newTime.value
			weekTime.value = o?.time || newTime.value
		}
		if(o.isshow) {
			isShow.value = o.isshow
		}
		if(o.day) {
			getDayTime(Number(o.day) - 1)
		} else {
			getSectionTime()
		}
		getUp()
		getList()
		getWeekList(newTime.value)
		getTimeList()
	})
	onShow(() => {
		getList()
	})
	onReady(() => {
		uni.getSystemInfo({
			success: (e) => {
				statusHeight.value = e.statusBarHeight * 2
			},
		})
	})
	onBackPress((o) => {
		console.log('from:' + o)
		return false
	})

	function openRl() {
		timeShow.value = !timeShow.value
	}
	async function getTimeList() {
		var year = formatDate(new Date(), 'YYYY')
		var month = formatDate(new Date(), 'MM')
		var day = formatDate(new Date(year, month, 0), 'DD')
		var res = await ycDietDateList({
			start_date: year + '-' + month + '-01',
			end_date: year + '-' + month + '-' + day,
			form:3,
			child_id:childId,
      uid:userId.value
		})
		var list = res.data.data
		var arr = []
		for(var i in list) {
			if(list[i].is_record) {
				arr.push({
					date: list[i].date,
				})
			}
		}
		var ress = await ycSportDateList({
			start_date: year + '-' + month + '-01',
			end_date: year + '-' + month + '-' + day,
			form:3,
			child_id:childId,
      uid:userId.value
		})
		var lists = ress.data.data
		for(var i in lists) {
			if(lists[i].is_record) {
				arr.push({
					date: lists[i].date,
				})
			}
		}
		info.value.selected = arr
	}
	async function getSectionTime() {
		var res = await ycDietRecordStartDate({
			type: 1,
			form:3,
			child_id:childId,
      uid:userId.value
		})
		let date = res.data.date ? res.data.date : newTime.value
		var tYear = new Date(date).getFullYear()
		var startTime = tYear + '-01-01'
		var eYear = new Date(newTime.value).getFullYear()
		var endTime = eYear + '-12-31'
		startDate.value = startTime
		endDate.value = endTime
	}

	function jianDate(Ttime, num) {
		var tt = new Date(Ttime)
		var ti = tt.getTime() - 1000 * 60 * 60 * 24 * num
		var time = new Date(ti)
		var y = time.getFullYear()
		var m = time.getMonth() + 1
		var d = time.getDate()
		if(m < 10) {
			m = '0' + m
		}
		if(d < 10) {
			d = '0' + d
		}
		var date = y + '-' + m + '-' + d
		return date
	}
	async function getDayTime(num) {
		endDate.value = formatDate(new Date(dateTime.value), 'YYYY-MM-DD')
		startDate.value = jianDate(endDate.value, num)
	}

	//加餐
	function addExtraMeal(index) {
		showExtraMeal.value = false
		let today = formatDate(Date.now(), 'YYYY-MM-DD')
		toUrla(`/pediatrics/weightManagement/dietaryRecords/index?mealIndex=${index + 3}&time=${today}`)
	}

	function bindFoot(index) {
		footIndex.value = index
		if(index == 4) {
			toUrla(
				'/pediatrics/weightManagement/sportRecords/index?time=' + dateTime.value + '&isAdd=1',
			)
		} else if(index == 3) {
			showExtraMeal.value = true
		} else {
			toUrla(
				'/pediatrics/weightManagement/dietaryRecords/index?mealIndex=' +
				index.toString() +
				'&time=' +
				dateTime.value +
				'&isAdd=1',
			)
		}
	}

	function toUrl(url){
		navigateTo(url+'?childId='+childId)
	}
	function toUrla(url){
		navigateTo(url+'&childId='+childId)
	}
	function getWeekList(time) {
		let date = new Date(time)
		let Time = date.getTime()
		let day = date.getDay()
		let oneDayTime = 24 * 60 * 60 * 1000
		let a = Time - (day - 0) * oneDayTime
		let b = Time - (day - 1) * oneDayTime
		let c = Time - (day - 2) * oneDayTime
		let d = Time - (day - 3) * oneDayTime
		let e = Time - (day - 4) * oneDayTime
		let f = Time - (day - 5) * oneDayTime
		let g = Time - (day - 6) * oneDayTime
		let aa = formatDate(new Date(a), 'YYYY-MM-DD')
		let bb = formatDate(new Date(b), 'YYYY-MM-DD')
		let cc = formatDate(new Date(c), 'YYYY-MM-DD')
		let dd = formatDate(new Date(d), 'YYYY-MM-DD')
		let ee = formatDate(new Date(e), 'YYYY-MM-DD')
		let ff = formatDate(new Date(f), 'YYYY-MM-DD')
		let gg = formatDate(new Date(g), 'YYYY-MM-DD')
		var week = [aa, bb, cc, dd, ee, ff, gg]
		weekList.value[0].value = aa
		weekList.value[1].value = bb
		weekList.value[2].value = cc
		weekList.value[3].value = dd
		weekList.value[4].value = ee
		weekList.value[5].value = ff
		weekList.value[6].value = gg
	}

	function compareDates(date1, date2) {
		var time1 = new Date(date1).getTime()
		var time2 = new Date(date2).getTime()

		if(time1 > time2) {
			return 1
		} else if(time1 < time2) {
			return -1
		} else {
			return 0
		}
	}

	function checkWeek(row, index) {
		var time = weekList.value[index].value
		var a = compareDates(time, startDate.value)
		var b = compareDates(time, endDate.value)
		if(a >= 0 && b <= 0) {
			dateTime.value = weekList.value[index].value
			getList()
		}
	}

	// 打开分享
	function toDetail() {
		if(store.token) {
			shareRef.value.open()
		} else {
			login.value.open()
		}
	}

	//分享到医生
	function gotoChatShare(i) {
		if(sportList.value.length > 0 || itemList.value.length > 0) {
			toUrla(
				`/pregnancy/index/doctor-chat?doctor_id=${i?.doctor_id}&avatar=${i?.avatar}&name=${i?.dname}&id=${i?.id}&date=${dateTime.value}&type=2`,
			)
		} else {
			showToast('当前日期没有记录')
		}
	}

	function getList() {
		loading.value = true
		getMealList()
		getSportList()
	}
	async function getMealList() {
		var num = 0
		var res = await ycDietDailyDiet({
			date: dateTime.value,
			form:3,
			child_id:childId,
      uid:userId.value
		})
		var list = res.data?.data || []
		for(var i in list) {
			num += list[i].list.length || 0
		}
		itemNum.value = num
		itemList.value = list
		loading.value = false
	}
	async function getSportList() {
		var res = await ycDietDailySport({
			date: dateTime.value,
			form:3,
			child_id:childId,
      uid:userId.value
		})
		sportList.value = res.data?.data || []
		loading.value = false
	}

	function toEdit(index, indexs, row, title) {
		if(isShow.value) {
			return false
		}
		editShow.value = true
		editIndex.value = index
		editIndexs.value = indexs
		editDetail.value = row
		editTitle.value = title
		mealNum.value = row.num.toString()
	}

	function toEditSport(index, row) {
		if(isShow.value) {
			return false
		}
		editSportShow.value = true
		editSportIndex.value = index
		editSportDetail.value = row
		mealSportNum.value = row.num.toString()
	}

	async function bindNum(e) {
		editDetail.value.unit = e.unit
		editDetail.value.num = e.num
		mealNum.value = ''
		var res = await ycDietEditDiet({
			id: editDetail.value.id,
			num: Number(e.num),
			unit: e.unit,
			form:3,
			child_id:childId,
      uid:userId.value
		})
		if(res.code == 200) {
			var a = editIndex.value
			var b = editIndexs.value
			itemList.value[a].list[b] = editDetail.value
			editShow.value = false
			getMealList()
		}
		uni.showToast({
			title: res.msg,
			icon: 'none',
			duration: 2000,
		})
	}

	async function bindSportNum(e) {
		mealSportNum.value = ''
		var res = await ycSportEditDiet({
			id: editSportDetail.value.id,
			num: Number(e.num),
			unit: e.unit,
			form:3,
			child_id:childId,
      uid:userId.value
		})
		if(res.code == 200) {
			var a = editSportIndex.value
			sportList.value[a] = editSportDetail.value
			editSportShow.value = false
			getSportList()
		}
		uni.showToast({
			title: res.msg,
			icon: 'none',
			duration: 2000,
		})
	}

	var startX = 0

	function touchStart(e) {
		if(e.touches.length == 1) {
			//设置触摸起始点水平方向位置
			startX = e.touches[0].clientX
		}
	}

	function touchEndTab(e) {
		var index = e.currentTarget.id.split(',')[0]
		var indexs = e.currentTarget.id.split(',')[1]
		if(e.changedTouches.length == 1) {
			//手指移动结束后水平位置
			var endX = e.changedTouches[0].clientX
			let diff = endX - startX
			if(Math.abs(diff) > 40) {
				if(diff > 0) {
					console.log('右滑...')
					itemList.value[index].list[indexs].del = false
				} else {
					console.log('左滑...')
					itemList.value[index].list[indexs].del = true
				}
			}
		}
	}

	function touchEndSportTab(e) {
		var index = e.currentTarget.id.split(',')[0]
		var indexs = e.currentTarget.id.split(',')[1]
		if(e.changedTouches.length == 1) {
			//手指移动结束后水平位置
			var endX = e.changedTouches[0].clientX
			let diff = endX - startX
			if(Math.abs(diff) > 40) {
				if(diff > 0) {
					console.log('右滑...')
					sportList.value[index].del = false
				} else {
					console.log('左滑...')
					sportList.value[index].del = true
				}
			}
		}
	}

	function jiaDate(num) {
		var tt = new Date(weekTime.value)
		var ti = tt.getTime() + 1000 * 60 * 60 * 24 * num
		var time = formatDate(ti, 'YYYY-MM-DD')
		weekTime.value = time
		getWeekList(weekTime.value)
	}

	function handleMove(e) {
		var left = e?.changedTouches[0].clientX
		calenderMove.value.x = left - startX
	}

	function touchEndWeek(e) {
		if(e.changedTouches.length == 1) {
			//手指移动结束后水平位置
			var endX = e.changedTouches[0].clientX
			let diff = endX - startX
			if(Math.abs(diff) > 40) {
				if(diff > 0) {
					console.log('右滑..11.')
					jiaDate(-7)
				} else {
					console.log('左滑..22.')
					jiaDate(7)
				}
			}
		}
		calenderMove.value.x = 0
	}

	async function toDel(index, indexs, id) {
		var res = await ycDietDelRecord({
			id: id,
			form:3,
			child_id:childId,
      uid:userId.value
		})
		if(res.code == 200) {
			itemList.value[index].list.splice(indexs, 1)
			if(itemList.value[index].list.length == 0) {
				itemList.value.splice(index, 1)
			}
		}
		uni.showToast({
			title: res.msg,
			icon: 'none',
			duration: 2000,
		})
	}

	async function toSportDel(index, id) {
		var res = await ycSportDelRecord({
			id: id,
			form:3,
			child_id:childId,
      uid:userId.value
		})
		if(res.code == 200) {
			sportList.value.splice(index, 1)
		}
		uni.showToast({
			title: res.msg,
			icon: 'none',
			duration: 2000,
		})
	}

	function changeDay(e) {
		dateTime.value = e.fulldate
		weekTime.value = e.fulldate
		getWeekList(dateTime.value)
		timeShow.value = false
		getList()
	}

	function backToday() {
		timeShow.value = false
		dateTime.value = newTime.value
		weekTime.value = newTime.value
		getWeekList(dateTime.value)
		getList()
	}
</script>

<style lang="scss">
	page {
		background: #f6f6f6;
	}
</style>
<style lang="scss" scoped>
	.pages {
		min-height: 100vh;
		background: #f6f6f6;
	}

	.topCen {
		height: 56rpx;
		background: #54CEAB;
		border-radius: 28rpx;
		margin: 12rpx auto;
		padding: 0 30rpx;
		line-height: 56rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 600;
		font-size: 36rpx;
		color: #ffffff;
		.topCen_img {
			width: 20rpx;
			height: 20rpx;
			margin-left: 16rpx;
			position: relative;
			top: -4rpx;
		}
	}

	.head_img {
		width: 42rpx;
		height: 42rpx;
		margin-right: 23rpx;
		image {
			width: 42rpx;
			height: 42rpx;
		}
	}

	.head_img1 {
		width: 42rpx;
		height: 42rpx;
		image {
			width: 42rpx;
			height: 42rpx;
		}
	}

	.add_box {
		.topCena {
			width: 100%;
			height: 100%;
			z-index: 1;
			padding: 10rpx 0;
			box-sizing: border-box;
			.head_data {
				width: 100%;
				height: 64rpx;
				font-size: 36rpx;
				font-family: PingFang-SC-Heavy, PingFang-SC;
				font-weight: 800;
				color: #333333;
				line-height: 64rpx;
				text-align: center;
				.head_data_img {
					width: 18rpx;
					height: 12rpx;
					margin-left: 10rpx;
					position: relative;
					top: -6rpx;
				}
			}
		}
	}

	.date_box {
		position: fixed;
		left: 0;
		background: rgba(0, 0, 0, 0.5);
		width: 100%;
		height: 100vh;
		z-index: 11;
		.date_box_con {
			background: #ffffff;
			padding-bottom: 30rpx;
			border-radius: 0 0 20rpx 20rpx;
		}
	}

	.sec_head {
		box-sizing: border-box;
		padding: 15rpx 30rpx;
		background: #fff;
		width: 100%;
		overflow: hidden;
		z-index: 10;
		position: sticky;
		left: 0;
		.sec_head_l {
			width: 58rpx;
			height: 58rpx;
			border-radius: 16rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 500;
			font-size: 36rpx;
			line-height: 58rpx;
			text-align: center;
		}
		.sec_head_box {
			width: 300%;
			height: 58rpx;
			overflow: hidden;
			margin-left: -690rpx;
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;
		}
	}

	.section {
		.sec_none {
      height:80vh;
			box-sizing: border-box;
			padding: 30rpx;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
			.sec_none_text {
				font-family: PingFang SC, PingFang SC;
				font-weight: 400;
        font-size: 26rpx;
        color: #AAAAAA;
				line-height: 50rpx;
				margin-top: 10rpx;
				text-align: center;
			}
      .sec_none_con_img {
					width: 212rpx;
					height: 193rpx;
          margin: 0 auto;
				}
			.sec_none_con {
				width: 690rpx;
				height: 328rpx;
				border-radius: 30rpx;
				border: 1rpx dashed #999999;
				text-align: center;
				box-sizing: border-box;

				.sec_none_con_text {
					font-family: PingFang SC, PingFang SC;
					font-weight: 500;
					font-size: 20rpx;
					color: #999999;
					line-height: 30rpx;
					text-align: center;
					padding: 23rpx;
				}
			}
		}
		.sex_meal {
			.sex_meal_list {
				width: 702rpx;
				background: #ffffff;
				border-radius: 10rpx;
				margin: 10rpx auto;
				box-sizing: border-box;
				padding: 0 20rpx;
				.sex_meal_list_title {
					font-family: PingFang SC, PingFang SC;
					font-weight: 600;
					font-size: 28rpx;
					color: #333333;
					line-height: 40rpx;
					text-align: left;
					padding-top: 20rpx;
				}
				.sex_meal_list_box {
					.sex_meal_list_box_list {
						border-bottom: 2rpx solid #f6f6f6;
						padding: 20rpx 0;
						position: relative;
						overflow: hidden;
						.sex_meal_list_box_list_img {
							width: 83rpx;
							height: 83rpx;
							border-radius: 18rpx;
							float: left;
						}
						.sex_meal_list_box_list_box {
							display: flex;
							flex-wrap: wrap;
							justify-content: space-between;
							width: 570rpx;
							float: right;
							.sex_meal_list_box_list_box_l {
								max-width: 500rpx;
								.sex_meal_list_box_list_box_l_t {
									font-family: PingFang SC, PingFang SC;
									font-weight: 500;
									font-size: 28rpx;
									color: #333333;
									line-height: 40rpx;
									overflow: hidden;
									text-overflow: ellipsis;
									white-space: nowrap;
								}
								.sex_meal_list_box_list_box_l_b {
									font-family: PingFang SC, PingFang SC;
									font-weight: 500;
									font-size: 24rpx;
									color: #666666;
									line-height: 28rpx;
									line-height: 34rpx;
									margin-top: 9rpx;
								}
							}
							.sex_meal_list_box_list_box_r {
								width: 44rpx;
								padding: 25rpx 0;
								image {
									width: 24rpx;
									height: 24rpx;
								}
							}
							.sex_meal_list_box_list_box_del {
								width: 96rpx;
								height: 83rpx;
								background: #da180a;
								position: absolute;
								top: 20rpx;
								right: 0;
								font-family: PingFang SC, PingFang SC;
								font-weight: 500;
								font-size: 28rpx;
								color: #ffffff;
								line-height: 83rpx;
								text-align: center;
							}
						}
					}
				}
			}
		}
	}

	.foot {
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 150rpx;
		background: #fff;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		.foot_l {
			width: 20%;
			text-align: center;
			.foot_l_img {
				width: 50rpx;
				height: 50rpx;
				margin-top: 30rpx;
			}
			.foot_l_text {
				font-family: PingFang SC, PingFang SC;
				font-weight: 500;
				font-size: 28rpx;
				color: #333333;
				line-height: 40rpx;
				text-align: center;
			}
		}
	}

	//加餐弹窗
	.ExtraMeal_box {
		margin: 10rpx auto;
		.ExtraMeal_list {
			width: 686rpx;
			height: 100rpx;
			text-align: center;
			line-height: 100rpx;
			border-bottom: 2rpx solid #f6f6f6;
			font-size: 32rpx;
			color: #666666;
		}
		.cancel {
			width: 686rpx;
			height: 100rpx;
			text-align: center;
			line-height: 100rpx;
			font-size: 32rpx;
			color: #333333;
		}
	}
</style>
